<template>
	<view class="index">
		<view class="w100 bf xxk">
			<view class="dfbc bb1">
				<view class="f-g-1">
					<view class="tabs dfa f16">
						<view class="tab tac f-c-c" :class="current === i?'isTab':''"
							v-for="(v,i) in tabs" :key="i" :style="{color:current === i?'#000':'#666'}"
							@click="handTab(v,i)">{{v.name}}
							<view class="line" :style="{background: current === i?subColor:'#fff'}"></view>
						</view>
					</view>
				</view>
				<view class="f-g-0 flex f-c pr20">
					<u-icon name="search" color="#000" size="32" @click="sShow = !sShow"></u-icon>
				</view>
			</view>
			<view class="p2 bf" v-if="sShow">
				<view class="f-bt f-y-c">
					<view class="f-g-1">
						<u--input placeholder="请输入订单号/手机号/姓名" v-model="queryForm.keyword" @change="fetchData" prefixIcon="search"
							shape="circle" prefixIconStyle="font-size: 22px;color: #666;margin-right:10rpx;padding-left:10px"
							placeholderStyle="color:#666" customStyle="background:#f8f8f8;padding:15rpx 5rpx;" border="none">
						</u--input>
					</view>
					<view class="f-g-0 ml10 mr10"><text class="iconfont icon-icon_cuowu" style="font-size: 42rpx;" @click="clear"></text></view>
				</view>
			</view>
			<view class="p10 c6 bff1" v-if="current<1">
				<view class="f-1" style="overflow: auto;">
					<view class="types" style="overflow-x: auto;">
						<view class="type c0 f12" :class="typeNum === index?'isType':''" v-for="(item,index) in list2"
							:key="index"
							:style="{background:typeNum === index?'linear-gradient(to right, #fee14f, #fdc450)':'',fontWeight:typeNum===index?'bold':''}"
							@click="typeChange(index,item)">{{item.name}}
						</view>
					</view>
				</view>
			</view>
		</view>
		<scroll-view class="scroll f-1 bf8 db" :class="current == 1 && !sShow ? 'tt' : current == 0 && sShow ? 'dbs' : 'db'" scroll-y="true" :refresher-enabled='refresherEnabled'
			@refresherpulling="onPulling" @refresherrefresh="onRefresh" @refresherrestore="onRestore"
			@refresherabort="onAbort" :refresher-triggered="triggered" @scrolltolower="nextPage">
			<view class="f-1 p10 bff1" :class="current == 1 && sShow ? 'mt10' : ''">
				<list v-if="current == 0" :current="current" :orderList="orderList" @op="op"  />
				<!-- <record v-if="current == 1" :current="current" :orderList="orderList" @op="op"  /> -->
				<wine v-if="current == 1" :current="current" :orderList="orderList" :queryForm="queryForm" :total="total" @op="op" @fetchData="fetchData" @change="change" />
			</view>
		</scroll-view>

		<view class="buts pb10 bf">
			<view class="p-10-20 mb10 ">
				<view class="cf bs30 tac p10 wei" v-if="current<1"
					:style="{background:'linear-gradient(to right, #fee14f, #fdc450)',color:'#000'}" @click="rf">存酒
				</view>
				<view class="cf bs30 tac p10 wei" v-if="current==1"
					:style="{background:'linear-gradient(to right, #fee14f, #fdc450)',color:'#000'}" @click="addwine">添加酒品
				</view>
			</view>
		</view>
		<u-modal :show="notesShow" :showCancelButton="true" :negativeTop="30" title="取出" cancelText="取消"
			:confirmColor="subColor" @cancel="notesShow=false" @close="notesShow=false" @confirm="notesConfirm">
			<view class="slot-content f-1">
				<u--input v-model="lqnum" placeholder="请输入取出数量"  type="number"></u--input>
			</view>
		</u-modal>
	</view>
</template>

<script>
	import list from "./components/list.vue";
	import record from "./components/record.vue";
	import wine from "./components/wine.vue";
	export default {
		components: {
			list,
			record,
			wine,
		},
		data() {
			return {
				subColor: uni.getStorageSync('subject_color'),
				current: 0,
				tabs: [{
					name: '存酒订单',
					value: 'maked',
				}, {
					name: '酒品名称',
					value: 'wineName',
				}],
				sShow:false,
				refresherEnabled: true,
				triggered: false,
				notesShow:false,
				noteForm:{},
				lqnum:'',
				list2: [],
				typeNum:0,
				listzt:[{
					name: '全部',
					value: '',
				},{
					name: '存储中',
					value: 'start',
				}, {
					name: '全部取出',
					value: 'over',
				}, {
					name: '已过期',
					value: 'expired',
				}],
				listwm: [{
					name: '全部',
					value: '',
				},{
					name: '存酒记录',
					value: 'deposit',
				}, {
					name: '取酒记录',
					value: 'fetch',
				}],
				queryForm:{
					keyword: "",
					state: "",
					pageNo: 1,
					pageSize: 10,
				},
				apiPage:'dsOrder',
				
				orderList: [],
				callList: [],
				state: 'maked',
				total:0,
			}
		},
		onLoad() {
			this.fetchData()
			this.list2 = this.listzt
		},
		methods: {
			async handTab(v, i) {
				this.current = i
				this.state = v.value
				
				this.loading = true
				this.typeNum = 0
				this.queryForm.state = ''
				this.queryForm.pageNo = 1
				// if (i == 1) {
				// 	this.list2 = this.listwm
				// 	this.apiPage = 'dsLog'
				// }else 
				if(i == 1){
					this.apiPage = 'dStatis'
				}else{
					this.list2 = this.listzt
					this.apiPage = 'dsOrder'
				}
				await this.fetchData()
				this.loading = false
			},
			onPulling(e) {},
			onRefresh() {
				if (this._freshing) return;
				this.triggered = 'restore';
				this._freshing = true;
				this.queryForm.pageNo = 1
				this.fetchData()
				setTimeout(() => {
					this.triggered = false;
					this._freshing = false;
				}, 500)
			},
			onRestore() {
				this.triggered = 'restore';
			},
			onAbort() {},
			async fetchData(type) {
				this.status = 'loading'
				let {
					data: {
						list,
						pageNo,
						pageSize,
						total
					},
				} = await this.beg.request({
					url: `${this.api[this.apiPage]}`,
					data: this.queryForm,
				})
				if (type != 'nextPage' || this.queryForm.pageNo == 1) {
					this.orderList = list
				} else {
					if (list.length == 0) {
						this.status = 'nomore'
						return
					}
					this.orderList = this.orderList.concat(list)
				}
				this.total = total
				// this.list1[this.acTab].badge.value = total
				this.status = 'loadmore'
				this.time = ''
			},
			nextPage(e) {
				if (this.status == 'loading') {
					return
				}
				this.queryForm.pageNo++
				this.fetchData('nextPage')
			},
			async op(type, v) {
				if(type =='take'){
					this.noteForm = v
					return this.notesShow = true
				}else if(type =='orderPrint'){
					let {
						msg
					} = await this.beg.request({
						url: `${this.api.dPrint}/${v.id}`,
						method: "POST",
						data:{type:1}
					})
					this.fetchData()
					uni.$u.toast(msg)
					return
				}
				let n = '',
					a = ''
				switch (type) {
					case 'orderPrint':
						n = "你确认存酒吗";
						a = 'printOrder';
						break;
				}
				console.log(a, n)
				if (a == 'received' || a == 'maked' || a == 'completeOrder') {
					let {
						msg
					} = await this.beg.request({
						url: `${this.api[a]}/${v.id}`,
						method: "POST",
					})
					this.fetchData()
					uni.$u.toast(msg)
				} else {
					uni.showModal({
						title: '温馨提示',
						content: n,
						success: async (res) => {
							if (res.confirm) {
								let {
									msg
								} = await this.beg.request({
									url: `${this.api[a]}/${v.id}`,
									method: "POST",
								})
								this.fetchData()
								uni.$u.toast(msg)
							}
						}
					});
				}
			},
			async notesConfirm() {
				if(!this.lqnum){
					return uni.$u.toast('请输入取出数量')
				}
				if(this.lqnum > this.noteForm.residue){
					return uni.$u.toast('请输入正确的取出数量')
				}
				let {
					msg
				} = await this.beg.request({
					url: `${this.api.dsLog}`,
					method: "POST",
					data: {
						num: this.lqnum,
						storeId: this.noteForm.storeId,
						userId: this.noteForm.userId,
						drinksId: this.noteForm.drinksId,
						drinksOrderId: this.noteForm.id,
					},
				})
				this.lqnum = ''
				this.fetchData()
				uni.$u.toast(msg)
				this.notesShow = false
			},
			change(e) {
				this.queryForm.pageNo = e.current;
				this.fetchData(this.queryForm)
			},
			typeChange(i, v) {
				this.typeNum = i
				this.queryForm.state = v.value
				this.queryForm.pageNo = 1
				this.fetchData()
			},
			async rf() {
				uni.navigateTo({
					url: '/pages/order/wineStock/add'
				});
			},
			async addwine() {
				uni.navigateTo({
					url: '/pages/order/wineStock/wineAdd'
				});
			},
			clear(){
				this.sShow = false
				this.queryForm.keyword = ''
				this.fetchData()
			},
		}
	}
</script>

<style lang="scss" scoped>
	.xxk{
		width: 100%;
		position: fixed;
		left: 0;
		top: 0;
		z-index: 9999;
	}
	.tabs {
		padding: 5rpx 0 0 0;
		border-radius: 15rpx;
	
		.line {
			margin-top: 10rpx;
			width: 30rpx;
			height: 8rpx;
			margin-left: 12rpx;
		}
	}
	
	.db {
		height: 100%;
		margin-top: 160rpx;
		padding-bottom: 160rpx;
	}
	
	.dbs{
		margin-top: 270rpx;
	}
	
	.tt{
		margin-top: 100rpx;
	}
	
	.tab {
		padding: 15rpx;
		width: 50%;
		color: #666;
	}
	
	.isTab {
		border-radius: 15rpx;
		font-weight: 600;
		// color: #fff;
	}
	
	.bff1 {
		background: #f1f1f1;
	}
	
	.types {
		width: 650px;
		height: 54rpx;
	
		.type {
			display: inline-block;
			margin-right: 20rpx;
			padding: 10rpx 20rpx;
			height: 50rpx;
			border-radius: 8rpx;
			background: #fff;
		}
	}

	.buts {
		width: 100%;
		position: fixed;
		left: 0;
		bottom: 0;
		z-index: 9999;
	}
</style>